<template>
	<view class="padb20">
		<stop isBack>
			<view slot="content">设备保养计划</view>
		</stop>
		<view class="mart3">
			<stab @change="(index)=>{curTab=index}" :names="['计划信息','绑定设备','部门人员']"></stab>
		</view>
		<view class="padlr3" v-show="curTab == 0">
			<view class="lh2 bcf pad2 bdtso mart3">
				<view class="list-style-2 flrc">
					<view class="flex1">计划信息</view>
				</view>
				<view class="lh2 bcf pad2 mart3">
					<sentity label="保养等级" model="MachineMaintainLevel" placeholder="请选择" v-model="en.level"></sentity>
				</view>
				<view class="lh2 bcf pad2 mart3">
					<sentity label="计划类型" model="MachinePlanType" placeholder="请选择" v-model="en.type"></sentity>
				</view>
				<view class="lh2 bcf pad2 mart3 bdtda">
					<stext label="间隔天数"placeholder="[选填]自定义周期时填写" v-model="en.day"></stext>
				</view>
				<view class="lh2 bcf pad2 bdtda">
					<sdatetime label="首次开始" placeholder="请选择" v-model="en.startAt"></sdatetime>
				</view>
				<view class="lh2 bcf pad2 bdtda">
					<sswitch label="是否运行" v-model="en.isRun"></sswitch>
				</view>
				<view class="lh2 bcf pad2 bdtda">
					<stextarea label="计划描述" placeholder="简单说明计划内容" v-model="en.info"></stextarea>
				</view>
			</view>
		</view>
		<view class="padlr3" v-show="curTab == 1">
			<view class="lh2 bcf bdtso mart3">
				<view>
					<machine-picker v-model="en.machine"></machine-picker>
				</view>
				<!-- <view class="martb2 flrc lh2 padt5" v-show="showSelectedMachine">
					<view class="wh30-30 flcc bdso round3 marr10 pos-r" @tap="scanMachine">
						<view class="cuIcon cuIcon-scan fs24 mart5"></view>
						<view class="mart2">扫码选择</view>
						<ripple></ripple>
					</view>
					<view class="wh30-30 flcc bdso round3 pos-r" @tap="showSelectMachine">
						<view class="cuIcon cuIcon-list fs24 mart5"></view>
						<view class="mart2">列表选择</view>
						<ripple></ripple>
					</view>
				</view>
				<view class="pad3 bdso bcf mart3" v-show="isbool(en.machines)">
					<view class="pad1 mart3 pos-r ofh bc13 round3" @tap="mySlide(index)" v-for="machine,index in en.machines" :key="machine" >
						<machine-item class="w100" :iri.sync="machine"></machine-item>
						<ripple></ripple>
						<sslide ref="mySlideBox">
							<view class="flex1 flcc bg-gradual-orange">
								<view @tap="deleteMachine(index)" class="padlr8 w100 cf pos-r">删除 <ripple></ripple> </view>
							</view>
						</sslide>
					</view>
					
				</view> -->
			</view>
		</view>
		<view class="padlr3" v-show="curTab == 2">
			<view class="lh2 bcf pad2 bdtso mart3">
				<view class="list-style-2 flrc">
					<view class="flex1">相关人员及部门</view>
				</view>
				<view class="lh2 bcf pad2 bdtda">
					<stree label="责任部门" model="Department" placeholder="请选择" v-model="en.department"></stree>
				</view>
				<view class="lh2 bcf pad2 bdtda">
					<suser label="负责人"  v-model="en.manageBy" placeholder="请选择"></suser>
				</view>
			</view>
		</view>
		
		<!-- <loading :loading="myIsLoading"></loading> -->
		<machine-selector :show="showSelectListMachine" @onSelect="selectMachine"></machine-selector>
		
		<view class="lh2 bcf pad2 bdtso pos-f l0 r0 b0">
			<view class="tac pad2 line-green round cu-btn lg w100 " @tap="submit">
				<view>提交</view>
				<ripple></ripple>
			</view>
		</view>
	</view>
</template>

<script>
	import machineItem from '../../templete/machine/machine_item.vue'
	import machineSelector from '../../templete/machine/machine_selector.vue'
	import MescrollCompMixin from "@/components/mescroll-uni/mixins/mescroll-comp.js";
	import machinePicker from '../../templete/machine/machine_picker.vue'
	export default {
		// mixins:[MescrollCompMixin],
		components:{machineItem,machineSelector,machinePicker},
		data() {
			return {
				curTab:0,
				id:"",
				en:{
					type:'',
					day:"0",
					startAt:'',
					info:'',
					department:'',
					manageBy:'',
					machine:''
				},
				showSelectListMachine:true,
				showSelectedMachine:true,
				selectedMachine:{
					id:'',
					code:'',
					iri:''
				},
				sslide:[]
			}
		},
		methods: {
			showSelectMachine(){
				this.showSelectListMachine = Math.random()
			},
			selectMachine(val){
				if(!this.$com.isInArray(val,this.en.machines)){
					this.en.machines.push(val)
				}else{
					this.$com.showToast('该设备已存在')
				}
			},
			scanMachine(){
				this.$dev.scan(info=>{
					this.selectedMachine.code = info
				},(err)=>{
				})
			},
			deleteMachine(index){
				this.en.machines.splice(index,1);
			},
			submit(){
				this.log(this.en)
				//检查数据
				// id:'',
				// type:'',
				// day:"0",
				// startAt:'',
				// info:'',
				// department:'',
				// manageBy:'',
				// machines:[]
				if(this.isnull(this.en.machine)){this.$com.showToast('选择设备');return;}
				if(this.isnull(this.en.level)){this.$com.showToast('请选择保养等级');return;}
				if(this.isnull(this.en.type)){this.$com.showToast('请选择类型');return;}
				if(this.isnull(this.en.startAt)){this.$com.showToast('请选开始时间');return;}
				if(this.isnull(this.en.info)){this.$com.showToast('请填写计划描述');return;}
				if(this.isnull(this.en.department)){this.$com.showToast('选择相关部门');return;}
				if(this.isnull(this.en.manageBy)){this.$com.showToast('选择相关人员');return;}
				this.$api.put("/api/machinePlanMaintains",this.en,(res)=>{
					this.log(res)
					if(res.s == 1){
						this.goback()
					}
				})
			}
		},
		onLoad(option) {
			this.id = option.id
			this.en.id = option.id
			if(this.isbool(this.id)){
				this.$api.get("/api/machinePlanMaintains/" + this.id, {},res=>{
					this.log(res)
					this.clearLoading()
					this.en = res.d
				})
			}
		}
	}
</script>

<style>

</style>
